<template>
  <div
    style="height: 523px; overflow: hidden; background: white; border:1px solid white ; border-radius: 8px; margin-top: 10px;">
    <div style="padding: 14px;">
      <h4 style="text-align: left; margin-left: -3px;">符合条件的工序设计单总数：{{this.tableData.length}} 例</h4>
    </div>

    <div style="background-color: #E9EEF3; height: 450px; margin: 10px; padding: 4px; border-radius: 7px;">
      <template>
        <el-table :data="tableData" style="width: 100%;height: 400px;">
          <el-table-column prop="pducess_id" label="工序设计单编号" width="272">
          </el-table-column>
          <el-table-column prop="proSige_id" label="产品编号" width="100">
          </el-table-column>
          <el-table-column prop="pName" label="产品名称" width="100">
          </el-table-column>
          <el-table-column prop="designer" label="设计人" width="100">
          </el-table-column>
          <el-table-column prop="regtime" label="登记时间" width="190">
          </el-table-column>
          <el-table-column prop="gongShiPrice" label="工时总成本" width="130">
          </el-table-column>
          <el-table-column label="审核" show-overflow-tooltip>
            <template slot-scope="scope">
              <el-button type="primary" size="mini" @click="zhisjd(scope.row)" round="">制定</el-button>
            </template>
          </el-table-column>

        </el-table>
      </template>
      <div class="block" style="margin-top: 15px;">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
          :page-sizes="[1,2,7]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
      </div>
    </div>


    <el-dialog title="生产工序设计单" :visible.sync="dialogVisible" width="62%" height="300px" :before-close="handleClose">
      <p style="margin-left: 532px;margin-bottom: 20px;">
      </p>
      <el-form :model="proproSheet">
        <el-row>
          <el-col :span="16">
            <h4 style="text-align: left; ">设计单编号:{{ this.proproSheet.pducess_id}}</h4>
          </el-col>
          <el-col :span="8">
            <h4 style="text-align: right; ">设计人:{{ this.proproSheet.designer}}</h4>
          </el-col>
        </el-row>
        <el-row style="margin-top: 14px;">
          <el-col :span="16">
            <h4 style="text-align: left; ">产品名称:{{this.proproSheet.pName}}</h4>
          </el-col>
          <el-col :span="8">
            <h4 style="text-align: right;">产品编号:{{this.proproSheet.proSige_id}}</h4>
          </el-col>
        </el-row>

        <el-table border ref="multipleTable" :data="tableData1" tooltip-effect="dark"
          style="width: 100%;margin-top: 25px;" @selection-change="handleSelectionChange" size="mini">
          <el-table-column prop="pucess_gid" label="序号" width="60">
          </el-table-column>
          <el-table-column prop="processesName" label="工序名称" width="80">
          </el-table-column>
          <el-table-column prop="processesid" label="工序编号" width="80">
          </el-table-column>
          <el-table-column prop="processesDes" label="描述" width="100">
          </el-table-column>
          <el-table-column prop="gongShiNum" label="工时数(小时)" width="95">
          </el-table-column>
          <el-table-column prop="gSsumPrice" label="工时成本小计(元)" width="120">
          </el-table-column>
          <el-table-column prop="wugCount" label="物料成本小计(元)" width="120">
          </el-table-column>
          <el-table-column label="设计物料" width="86">
            <template slot-scope="scope">
              <el-button v-if="scope.row.isgxwl == '设计' " type="primary" @click="ProWuSheji(scope.row)" size="mini"
                style="width: 60px; height: 30px;" round>设计</el-button>
              <el-button v-if="scope.row.isgxwl == '重新设计' " type="danger" @click="open(scope.row)" size="mini"
                style="width: 80; height: 30px;" round>重新设计</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- designer -->
        <el-row style="margin-top: 25px;">
          <el-col :span="16">
            <h4 style="text-align: left;">工时总成本:{{this.proproSheet.gongShiPrice}}</h4>
          </el-col>
          <el-col :span="8">
            <h4 style="text-align: right;">物料总成本:{{this.proproSheet.wuliaoSumPrice}}</h4>
          </el-col>

        </el-row>


        <el-row style="margin-top: 15px;">
          <el-col :span="16">
            <h4 style="text-align: left;">审核人:{{this.proproSheet.thereviewer}}</h4>
          </el-col>
          <el-col :span="8">
            <h4 style="text-align: right;">审核时间 : {{this.proproSheet.audittime}}</h4>
          </el-col>
        </el-row>
        <el-row style="margin-top: 12px;">
          <el-col :span="16">
            <h4 style="text-align: left;">设计要求:</h4>
          </el-col>
        </el-row>

        <textarea v-model="proproSheet.designreq"
          style="margin-top: 6px;margin-right:0px;width: 744px; height: 85px;"></textarea>

      </el-form>
      <span slot="footer">
        <el-button style="width: 45px ; height: 25px;" @click="dialogVisible = false">关 闭</el-button>
        <el-button style="width: 45px ; height: 25px;" type="primary" @click="makeprocess_2()">确定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="工序物料设计单" :visible.sync="dialogVisible2" width="62%" height="300px" :before-close="handleClose">
      <el-row>
        <el-col :span="24" style="text-align: left;">
          <h4> 制造产品:{{this.proproSheet.pName}}，供选择的物料清单如下：</h4>
        </el-col>
      </el-row>
      <el-table border ref="multipleTable2" :data="tableData2" tooltip-effect="dark"
        style="width: 100%;margin-top: 5px;" size="mini">
        <el-table-column type="index" :index="1" width="90">
        </el-table-column>
        <el-table-column prop="pName" label="物料名称" width="90">
        </el-table-column>
        <el-table-column prop="wid" label="物料编号" width="90">
        </el-table-column>
        <el-table-column prop="designNum" label="设计数量" width="90">
        </el-table-column>
        <el-table-column prop="keyongNum" label="可用数量" width="90">
        </el-table-column>
        <el-table-column prop="wuprice" label="单价(元)" width="90">
        </el-table-column>
        <el-table-column label="本工序数量" width="90">
          <template slot-scope="scope">
            <el-input v-model="scope.row.wunum" v-on:input="getWunum(scope.row)" controls-position="right" size="mini"
              style="width: 75px" class="inputClass">
            </el-input>
          </template>

        </el-table-column>
        <el-table-column label="物料费用小计" show-overflow-tooltip>
          <template slot-scope="scope">
            <el-input v-model="scope.row.wuCount=scope.row.wunum*scope.row.wuprice" controls-position="right"
              size="mini" style="width: 75px" class="inputClass">
            </el-input>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer">
        <el-button style="width: 45px ; height: 25px;" @click="closeW()">关闭</el-button>
        <el-button style="width:  80px ; height: 25px;" type="primary" @click="qdgx()">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: 'repset',
    data() {
      return {
        o: 0,
        pageNum: 1,
        pageSize: 7,
        total: 0,
        tableData: [],
        tableData1: [],
        tableData2: [],
        name: '',

        dialogVisible: false,
        dialogVisible2: false,
        multipleSelection: [],
        mpsDto: {
          proproSheet: {},
          dproList: [],
          materialList: []
        },
        new_proproSheet: {},
        proproSheet: {
          pducess_id: '', //设计编号
          proSige_id: '', //产品编号
          regtime: '',
          designer: '', //设计人
          redner: '',
          designreq: '',
          pName: '', //产品名称
          gongShiPrice: '', //工时总成本
          thereviewer: '', //审核人
          audittime: '', //审核时间
          wuliaoSumPrice: 0 //物料总成本
        },
        MaterialList: {
          id: '',
          pducess_id: '', //设计单id
          proSige_id: '', //产品档案
          processesid: '', //工序项目编号
          wid: '', //物料id
          wuprice: '', //单价
          wunum: '', //数量
          count: '' //小计
        },
        formLabelWidth: '120px'
      }
    },
    methods: {
      tableRowClassName({
        row,
        rowIndex
      }) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      },
      handleSizeChange(val) {
        this.pageSize = val;
        this.GetOnline(this.pageNum, this.pageSize);
      },
      handleCurrentChange(val) {
        this.pageNum = val;
        this.GetOnline(this.pageNum, this.pageSize);
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      toggleSelection(rows) {
        if (rows) {
          rows.forEach(row => {
            this.$refs.multipleTable.toggleRowSelection(row);
          });
        } else {
          this.$refs.multipleTable.clearSelection();
          this.$refs.multipleTable2.clearSelection();
          this.multipleSelection = [];

        }
      },
      handleSelectionChange(val) {
        this.multipleSelection = [];
        for (var i = 0; i < val.length; i++) {
          this.multipleSelection.push(val[i].id)
        }
        console.log(this.multipleSelection);

      },
      GetOnline(pageNum, pageSize) {
        var data = new URLSearchParams();
        data.append("pageNum", pageNum);
        data.append("pageSize", pageSize);
        this.$http.post('production/product/processWuLiaofindByPager', data).then(res => {
          this.pageNum = res.data.pageNum;
          this.pageSize = res.data.pageSize;
          this.total = res.data.total;
          this.tableData = res.data.rows;
        }).catch(err => {
          console.log(err);
        })
      },
      zhisjd(data) {
        this.proproSheet.pducess_id = data.pducess_id;
        this.proproSheet.designreq = data.designreq;
        this.proproSheet.audittime = data.audittime;
        this.proproSheet.thereviewer = data.thereviewer;
        this.proproSheet.gongShiPrice = data.gongShiPrice;
        this.proproSheet.pName = data.pName;
        this.proproSheet.designer = data.designer;
        this.proproSheet.pName = data.pName;
        this.proproSheet.proSige_id = data.proSige_id;
        this.proproSheet.regtime = this.regtime;
        var data = new URLSearchParams();
        data.append('pducess_id', this.proproSheet.pducess_id);
        data.append('proSige_id', this.proproSheet.proSige_id);
        this.$http.post('production/product/makeProcessSh', data).then(res => {
          if (res.status == 200) {
            this.tableData1 = res.data;
            var wuliaoSumPrice = 0;
            for (var i = 0; i < res.data.length; i++) {
              wuliaoSumPrice = wuliaoSumPrice + res.data[i].wugCount;
            }
            this.proproSheet.wuliaoSumPrice = wuliaoSumPrice;
          }
        }).catch(err => {
          console.log(err);
        })
        this.dialogVisible = true;
      },
      makeprocess_2() {
        var falg = true;
        var mes = [];



        for (var i = 0; i < this.tableData1.length; i++) {
          if (this.tableData1[i].isgxwl == "设计") {
            /* alert('请设计未完成的工序!'); */
            mes.push(this.tableData1[i].processesid);
            falg = false;
          }
        }
        if (falg == false) {
          this.$message({
            showClose: true,
            message: '请设计未完成的工序! 工序号:' + mes,
            type: 'error'
          });
          return;
        }
        var flag2 = true;
        this.$http.post('production/product/KeNumCount?proSige_id=' + this.proproSheet.proSige_id).then(res => {
          console.log(res.data);
          flag2 = res.data > 0 ? false : true
          if (!flag2) {
            this.$message({
              showClose: true,
              message: '尚有可用物料,请重新设计!',
              type: 'error'
            });
          }else{

              var data = this.proproSheet;
              this.$http.post('production/productionproduct/wcProcessWoLiaoSigin', this.$qs.stringify(data)).then(res => {
                if (res.status === 200) {
                  this.proproSheet.pducess_id = '';
                  this.proproSheet.designreq = '';
                  this.proproSheet.thereviewer = '';
                  this.proproSheet.gongShiPrice = '';
                  this.proproSheet.pName = '';
                  this.proproSheet.designer = '';
                  this.proproSheet.pName = '';
                  this.proproSheet.proSige_id = '';
                  this.proproSheet.regtime = '';
                  this.GetOnline(this.pageNum, this.pageSize);
                }

              }).catch(err => {
                console.log(err);
              });
              this.dialogVisible = false;
          }
          console.log(flag2);
        }).catch(err => {
          console.log(err);
        });





      },
      ProWuSheji(data) {
        this.name = data.processesName;
        this.new_proproSheet = data;
        var proSige_id = data.proSige_id;
        this.$http.post('production/product/selProcessdesginWuliao?proSige_id=' + proSige_id).then(res => {
          if (res.data.length != 0) {
            this.tableData2 = res.data;
          }
        }).catch(err => {
          console.log(err);
        })
        this.dialogVisible = false;
        this.dialogVisible2 = true;
      },
      qdgx() {
        var moeney = 0;
        for (var i = 0; i < this.tableData2.length; i++) {
          if (this.tableData2[i].wuCount == 0 || this.tableData2[i].wuCount == '' || this.tableData2[i].wuCount ==
            undefined) {
            this.tableData2[i].wuCount = 0;
          }
          moeney += this.tableData2[i].wuCount;
        }
        if (moeney == 0) {
          this.dialogVisible2 = false;
          this.dialogVisible = true;
          return;
        }
        var index = this.tableData1.findIndex(i => {
          if (this.new_proproSheet.processesName == i.processesName) {
            return true;
          }
        })
        if (moeney != 0 || moeney != undefined || moeney != "") {
          this.tableData1[index].wugCount = moeney;
          var materialList = this.tableData2;
          for (var i = 0; i < this.tableData2.length; i++) {
            materialList[i].proSige_id = this.new_proproSheet.proSige_id;
            materialList[i].pducess_id = this.new_proproSheet.pducess_id;
            materialList[i].processesid = this.new_proproSheet.processesid;
          }
          this.mpsDto.materialList = materialList;
          this.$http.post('production/product/setProcessWuliao', this.$qs.stringify(this.mpsDto, {
            arrayFormat: 'list',
            allowDots: true
          })).then(res => {
            if (res.status == 200) {
              this.new_proproSheet.wugCount = moeney;
              this.proproSheet.wuliaoSumPrice = this.proproSheet.wuliaoSumPrice + moeney;
              this.updateprocessWucount(this.new_proproSheet);
              this.tableData1[index].wuCount = moeney;
              this.flushtabledata1(this.proproSheet.pducess_id, this.proproSheet.proSige_id);
              this.dialogVisible2 = false;
              this.dialogVisible = true;
              return;
            }
          }).catch(err => {
            console.log(err);
          })
        }
        this.dialogVisible2 = false;
        this.dialogVisible = true;
      },
      updateprocessWucount(data) {
        this.$http.post('production/product/updateProcessWucount', this.$qs.stringify(data)).then(res => {
          if (res.status == 200) {
            conlog.log('工序价格小计价格更新成功结果');
          }
        }).catch(err => {
          console.log(err);
        })
      },
      getWunum(data) {
        if (data.wunum > data.keyongNum) {
          console.log('已经超过可用数量,请重新设置!');
          var index = this.tableData2.findIndex(i => {
            if (data.pName == i.pName) {
              return true;
            }
          })
          this.tableData2[index].wunum = 0;
        }
      },
      flushtabledata1(pducess_id, proSige_id) {
        var data = new URLSearchParams();
        data.append('pducess_id', pducess_id);
        data.append('proSige_id', proSige_id);
        this.$http.post('production/product/makeProcessSh', data).then(res => {
          if (res.status == 200) {
            this.tableData1 = res.data;
          }
        }).catch(err => {
          console.log(err);
        })
      },
      open(data) {
        this.$confirm('重新设计将首先清除原有本工序物料的设计，您确认进行重新设计吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          // this.$message({
          //   type: 'success',
          //   message: '重置成功!',
          // });
          var newData = new URLSearchParams();
          newData.append("proSige_id", data.proSige_id);
          newData.append("pducess_id", data.pducess_id);
          newData.append("processesid", data.processesid);
          console.log(data.processesid);
          this.$http.post('production/product/repalceWuliao', newData).then(res => {
            if (res.status === 200) {
              this.$message({
                type: 'success',
                message: '重置成功!',
              });
              var index = this.tableData1.findIndex(i => {
                if (data.processesName == i.processesName) {
                  return true;
                }
              })

              console.log("减之前" + this.proproSheet.wuliaoSumPrice);
              this.proproSheet.wuliaoSumPrice = this.proproSheet.wuliaoSumPrice - this.tableData1[index]
                .wugCount;
              console.log("减之后" + this.proproSheet.wuliaoSumPrice);




              this.flushtabledata1(data.pducess_id, data.proSige_id);

            }
          }).catch(err => {

          })


        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      closeW(){

        this.dialogVisible2 = false
      }
    },
    computed: {
      timer() {
        var date = new Date();
        var seperator1 = "-";
        var seperator2 = ":";
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate +
          " " + date.getHours() + seperator2 + date.getMinutes() +
          seperator2 + date.getSeconds();
        return currentdate;
      }
    },
    mounted() {
      this.GetOnline(this.pageNum, this.pageSize);

    }
  }
</script>

<style scoped="scoped">
  .el-input--mini .el-input__inner {
    height: 20px;
    line-height: 28px;
  }

  * {
    padding: 0px;
    margin: 0px;
  }

  .boder_one {
    border-top: none;
    border-left: none;
    border-right: none;
    width: 105px;
  }

  th {
    background-color: blue;
  }

  .el-table tr {
    background-color: royalblue;
  }

  .el-breadcrumb__inner {
    color: black;

  }

  .el-input__inner {

    height: 25px;

  }

  .el-input__prefix,
  .el-input__suffix {
    position: absolute;
    top: 7px;
    -webkit-transition: all .3s;
    height: 100%;
    color: #C0C4CC;
    text-align: center;
  }

  .el-table td {
    padding: 10px 0;
  }

  #father {
    height: 480px;
    overflow: hidden;
    background: white;
    border: 1px solid white;
    border-radius: 12px;

  }

  #sons {
    /* margin: 9px auto; */

    width: 100%;
    padding: 0px;
    background-color: white;
    margin-top: 15px;
    /* border: 3px solid whitesmoke; */
    /* border-radius: 16px; */

  }

  #son {

    padding: 15px;
    width: 100%;
    background-color: white;

  }
</style>
